<template>
    <a-scrollable :scrollbarDraggable="true">
        <a-menu class="app-menu c-b-r c-f-shrink-0" :items="menuItems" :getItemsFunc="(a) => a.files"
            @file-click="itemClick" ref="menu">
        </a-menu>
    </a-scrollable>
</template>

<script>
import { menuItems } from '../componentIndex'

export default {
    data() {
        return {
            menuItems
        }
    },
    mounted() {
        setTimeout(() => {
            this.findAndOpenCurrentFolder()
        }, 0)//过0秒再设置菜单，因为mounted时，路由还是/
    },
    methods: {
        itemClick(item) {
            this.$router.push(item.path)
        },
        findAndOpenCurrentFolder() {
            let currentPath = this.$route.path
            let toCheckList = [...this.menuItems]
            while (toCheckList.length) {
                let item = toCheckList.shift()
                if (currentPath == item.path) {
                    this.$refs.menu.activeItem(item)
                    return
                }
                if (item.files) {
                    toCheckList.push(...item.files)
                }
            }
        },
    }
}
</script>